<template>
  <div id="modifyItem">
    <!-- <el-form-item :label="prop.name" :prop="prop.code" v-if="!prop.hide && (!prop.addHide || !flag.add)"> -->
    <el-form-item :label="prop.name" :prop="prop.code"
      v-if="!(prop.hide || (flag.add && prop.addHide) || (!flag.add && prop.modifyHide))">
      <el-select v-if="prop.dict" v-model="param[prop.code]" :disabled="!flag.add && prop.readOnly" filterable
        :placeholder="'请选择'+prop.name" clearable>
        <el-option v-if="prop.dict == 'order'" v-for="index in 99" :key="index" :value="index+''" :label="index" />
        <el-option v-if="prop.dict != 'order'" v-for="(val, key, i) in $store.state.dict[prop.dict]" :key="key"
          :value="prop.int ? parseInt(key):key+''" :label="val" />
      </el-select>
      <el-select v-if="prop.state" :multiple="prop.multiple" v-model="param[prop.code]"
        :disabled="!flag.add && prop.readOnly" :placeholder="'请选择'+prop.name" filterable clearable>
        <el-option v-for="item in $store.state[prop.state]" :key="item.key" :value="item.key" :label="item.value" />
      </el-select>
      <el-autocomplete v-if="prop.autocomplete" v-model="param[prop.code]" :fetch-suggestions="prop.getData" onKeypress="return(event.keyCode != 32)"
        :placeholder="'请输入'+prop.name" clearable>
        <template slot-scope="{ item }">
          <div>{{ item.value + '--' + item[prop.labelKey] }}</div>
        </template>
      </el-autocomplete>
      <el-input v-if="!prop.dict && !prop.state && !prop.autocomplete" v-model="param[prop.code]" onKeypress="return(event.keyCode != 32)"
        :disabled="!flag.add && prop.readOnly" :placeholder="prop.desc ? prop.desc : '请输入'+prop.name" clearable />
    </el-form-item>
  </div>
</template>

<script>
  import {
    Vue,
    Component,
    Prop
  } from "vue-property-decorator";

  @Component
  export default class ModifyItem extends Vue {
    @Prop({
      type: Object
    }) prop;

    @Prop({
      type: Object
    }) flag;

    @Prop({
      type: Object
    }) param;

    created() {} //生命周期 - 创建完成（可以访问当前this实例）
    mounted() {} //生命周期 - 挂载完成（可以访问DOM元素）
    beforeCreate() {} //生命周期 - 创建之前
    beforeMount() {} //生命周期 - 挂载之前
    beforeUpdate() {} //生命周期 - 更新之前
    updated() {} //生命周期 - 更新之后
    beforeDestroy() {} //生命周期 - 销毁之前
    destroyed() {} //生命周期 - 销毁完成
    activated() {} //如果页面有keep-alive缓存功能，这个函数会触发
  }
</script>
<style scoped>

</style>
